<template>
  <view class="content">
    <view class="nav" :style="{ paddingTop: $util.getStatusBarHeight() }">
      <text @click="$util.goUrl(0)" class="iconfont icon-left" />
      <text :style="{ marginLeft: role == 5 ? '0rpx' : '236rpx' }">{{ title }}</text>
      <text @click="read">{{ role == 5 ? "全部已读" : "" }}</text>
    </view>
    <view class="tab">
      <tab @changeCurrent="changeCurrent" :tabList="showTab2 ? tabList2 : tabList" :current="current" />
    </view>
    <swiper
      :style="{ height: `calc(100vh - 172rpx - ${$util.getStatusBarHeight()})` }"
      :current="current"
      @change="swiperChange"
    >
      <swiper-item v-for="(item, index) in showTab2 ? tabList2 : tabList" :key="index">
        <my-list
          :ref="'tipsList' + index"
          :allRead="allRead"
          :type="showTab2 ? type2[index] : type[index]"
          :patientId="patientId"
          v-if="currentList.indexOf(index) > -1"
        />
      </swiper-item>
    </swiper>
    <suspension-button v-if="showTab2 && current == 1" :icon="'plus'" @suspensionButtonClick="add" />
  </view>
</template>

<script>
import Tab from "@/components/tab/tab.vue";
import suspensionButton from "@/components/suspension-button/suspension-button.vue";
import myList from "./components/list/list.vue";

export default {
  components: {
    Tab,
    myList,
    suspensionButton,
  },
  data() {
    return {
      title: "医生消息",
      role: uni.getStorageSync("role"),
      tabList: ["全部", "上传提醒", "日常护理", "异常数据"],
      tabList2: ["患者关怀", "日常提醒"],
      type: [0, 1, 3, 4],
      type2: [2, 3],
      currentList: [],
      current: -1,
      patientId: null,
      showTab2: false,
      allRead: false,
    };
  },
  watch: {
    current(val) {
      if (this.currentList.indexOf(val) < 0) {
        this.currentList.push(val);
      }
    },
  },
  onShareAppMessage() {
    return this.$util.returnShareObj();
  },
  onLoad(options) {
    this.patientId = options.patientId || uni.getStorageSync("patientId");
    //代表医生进入
    if (options.isDoctor) {
      this.showTab2 = true;
      this.current = Number(options.type) - 2;
      this.title = "患者照料";
    }
    this.current = 0;
  },
  methods: {
    changeCurrent(current) {
      this.current = current;
    },
    swiperChange(e) {
      this.current = e.detail.current;
    },
    add() {
      this.$util.goUrl(
        "/pagesPatient/tipsDetail/index?type=" +
          (this.showTab2 ? this.type2[this.current] : this.type[this.current]) +
          "&patientId=" +
          this.patientId
      );
    },
    refreshByBack() {
      if (this.showTab2) {
        this.$refs[`tipsList` + this.current][0].refresh();
      }
    },
    read() {
      this.$api.patientUpdateRemindRead().then((res) => {
        if (res.code == 200) {
          this.allRead = true;
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.content {
  background: $back-grey-color;
  min-height: 100vh;
  .nav {
    background-color: $theme-color;
    font-size: $big-font-size;
    text-align: center;
    color: #ffffff;
    height: 70rpx;
    // line-height: 70rpx;
    padding-bottom: 12rpx;
    align-items: center;
    display: flex;
    width: 100vw;
    align-items: center;
    // #ifdef MP-WEIXIN
    width: 75vw;
    padding-right: 25vw;
    // #endif
    text:first-child {
      padding: 0 20rpx;
    }
    text:nth-child(2) {
      font-size: $default-font-size;
    }
    text:last-child {
      margin-left: 90rpx;
      font-weight: bold;
      border-bottom: 1rpx solid #fff;
    }
  }
  .tab {
    z-index: 100;
    border-bottom: 1rpx solid $default-border-color;
    background: #ffffff;
  }

  .swiper {
    height: calc(100vh - 160rpx);
  }
}
</style>
